<template>
    <div class="tab-container">
      <h1>请假审批</h1>
      <el-table
      :data="tableData"
      style="width: 90%">
      <el-table-column
        prop="empName"
        label="员工"
        width="180">
      </el-table-column>
     
      <el-table-column
        prop="days"
        label="时间">
      </el-table-column>

      <el-table-column
        prop="auditStatusName"
        label="状态">
      </el-table-column>

      <el-table-column
        label="操作">
        <template slot-scope="scope">
          <el-button type="primary" @click="action(scope.$index, scope.row)">操作</el-button>
        </template>
      </el-table-column>
    </el-table>
     
    <el-dialog title="审批操作" :visible.sync="dialogFormVisible">
    <el-form :model="form">
      <el-form-item label="选择操作" :label-width="'120px'">
        <el-select v-model="form.auditStatus" placeholder="选择审批">
          <el-option  label="同意" :value="2"></el-option>
          <el-option  label="驳回" :value="3"></el-option>
        </el-select>
      </el-form-item>

    
      <el-form-item label="审批意见" :label-width="'120px'">
        <el-input v-model="form.auditOpinion" width="100px" autocomplete="off"></el-input>
        
      </el-form-item>
      
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="dialogFormVisible = false; form = {}">取 消</el-button>
      <el-button type="primary" @click="save">确 定</el-button>
    </div>
  </el-dialog>

     </div>
  </template>
  
  <script>
  import request from '@/utils/request';
  export default {
    name: 'leave',
    data() {
      return {
            tableData: [{
            date: '2016-05-02',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1518 弄',
            status:"待审批",
            man:"张三"
          }, {
            date: '2016-05-04',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1517 弄',
            status:"待审批",
            man:"李四"
          }],
          form: {},
          dialogFormVisible:false,
          leaveId:0
        } 
    },
    mounted(){
      this.auditlist();
    },
    methods:{
     async auditlist(){
        let res =  await request({
            url:"/admin/leave/auditlist",
          })
          res.rows.forEach(item=>{
            if( item.auditStatus==1){
              item.auditStatusName = "待审批";
            }else if(item.auditStatus==2){
              item.auditStatusName = "审批通过";
            }else {
              item.auditStatusName = "审批不通过";
            }
          })
          console.log("列表是",res)
          this.tableData = res.rows;
      },
      action(index,row){
        this.dialogFormVisible = true;
       
        this.leaveId = row.leaveId;
        console.log("122",this.leaveId);
      },
     async save(){
        let res =  await request({
            url:"/admin/leave/audit",
            method:"post",
            data:{
              leaveId:this.leaveId,
              auditStatus:this.form.auditStatus,
              auditOpinion:this.form.auditOpinion
            }
          })
          console.log("点击了确定",res);
      }
    }
   
  }
  </script>
  
  <style scoped>
    .tab-container{
      padding: 30px;
    }
  </style>
  